<template>
  <el-container>
    <el-header>
        <vxe-input
            v-model="inputtext"
            size="small"
            class="bk_samll_search"
            placeholder="选择内容"
            :readonly="1 == 1"
            @click="openSearch"
          >
            <template v-slot:suffix >
                <!-- @suffix-click="openSearch" -->
              <i class="vxe-icon--caret-bottom" @click="openSearch"></i>
            </template>
          </vxe-input>
      <el-input
        width="300"
        v-model="inputtext"
        placeholder="选择内容"
        :readonly="1 == 1"
      >
        <i  slot="suffix"
          class="el-input__icon el-icon-search"
          @click="openSearch"
        />
      </el-input>
      <vxe-input :value="val" placeholder="函数选择" @click="myFunc=true" />
      <vxe-modal ref="myFuncForm" v-model="myFunc" title="函数向导>>（双击添加函数）" resize width="480px">
        <function-Selector @funClick="funClick" />
      </vxe-modal>
    </el-header>
    
      <dic-panel
        key=""
        :open.sync="showDicPanel"
        :value="inputvalue"
        :callback="searchValue"
        :params="dicparam"
        :dickey="dickey"
      ></dic-panel>
      <el-main>
        <TreeSelect2 :option="treeSelectConfig" />
      </el-main>
   
  </el-container>
</template>
<script>
import dicPanel from "./dicPanel";
import TreeSelect2 from "@/components/psTree/treeSelect2"
import functionSelector from '@/components/FunctionSelector/FunctionSelector'
import {getRealUrl} from "@/utils/httpRequet"
export default {
  components: {
    dicPanel,TreeSelect2,
    functionSelector
  },
  data() {
    
    return {
      treeSelectConfig:{
        dicKey:'RWPD',
        multiple:true,
        dataUrl:getRealUrl("normalDicTree",true,{urlparam:["FLGL_TC_CLS_TREE"]}),
        beforeLoad:this.treeBeforeLoad,
        dataFilter:this.dataFilter
      },
      val: '',
      myFunc: false ,
      inputtext: "",
      inputvalue: "DIC_RS_2",
      showDicPanel: false,
      dickey:'M_D_M0208',
      dicparam: { root: "", as: "32",multiple:false},
    };
  },
  methods: {
    treeBeforeLoad(param,node){
        if (node.id == undefined) {
          return {p0: '0', p1: "TBJJ"}
        } else {
          return {p0: node.id, p1: "TBJJ"};
        }
    },
    dataFilter(data){
      for(let i=0;i<data.length;i++){
        data[i].isLeaf=data[i].leaf=='1';
      }
      return data;
    },
    funClick(val,name) {
      this.val = name+'：'+val
    },
    openSearch() {
      this.showDicPanel = true;
    },
    searchValue(valInfo, param) {
      this.inputvalue = valInfo.value;
      this.inputtext = valInfo.dispalyVal;
      
    },
  },
};
</script>